<!-- 修改分组/添加分组 -->
<template>
  <el-dialog
    :title="$t( '目录设置' )"
    :visible="visible"
    size="mini"
    width="340px"
    @closed="doCloseEdit"
    @open="doOpen"
    @update:visible="updateVisible"
    v-el-drag-dialog
  >
    <template>
      <el-form
        :inline="true"
        :model="editorForm"
        ref="editorFormRef"
        label-width="100px"
        size="small"
        label-position="left"
        :rules="editorFormRules"
        :show-message="false"
        :hide-required-asterisk="true"
        :status-icon="false"
        @submit.native.prevent
      >
        <el-form-item prop="showChild" label="显示子元素：">
          <el-switch
            v-model="editorForm.showChild"
            active-color="#1890ff">
          </el-switch>
        </el-form-item>
      </el-form>
    </template>
    <template slot="footer">
      <bs-button size="mini" plain text="取消" @click.native="doCloseEdit"></bs-button>
      <bs-button size="mini" type="primary" :loading="loading" text="确认" @click.native="onSubmit"></bs-button>
    </template>
  </el-dialog>
</template>

<script>
import elDragDialog from '@/directive/el-drag-dialog'
export default {
  name: 'deviceTreeAddDialog',
  props:{
    id:{
      type:[String,Number],
      default:'0'
    },
    showChild:{
      type:Boolean,
      default:true
    },
    visible:{
      type:Boolean,
      default:false
    }
  },
  data() {
    return {
      editorForm: {},
      editorFormRules: {
        // name: { required: true, message: '请输入分组名称', trigger: 'blur' },
      },
      loading:false
    }
  },
  directives: {
    elDragDialog,
  },
  methods: {
    updateVisible(val){
      this.$emit('update:visible',val)
    },
    doOpen(){

    },
    // 模态框关闭
    doCloseEdit () {
      this.updateVisible(false)
      this.$refs.editorFormRef.resetFields()
      this.loading = false
    },
    // 确认
    onSubmit() {
      
    },
  },
}
</script>

<style lang="scss" scoped>
.input{
  width: 234px;
}
</style>
